<style rel="stylesheet/scss" lang="scss">
@import "../../../../styles/prod.scss";

.pack-con {
  .upload-item {
    .el-col {
      height: 80px;
    }
    .el-main {
      padding: 0;
    }
    .upload-name {
      font-size: 14px;
      padding-top: 30px;
    }
    .upload-tip {
      font-size: 12px;
      color: #999;
      padding-bottom: 20px;
    }
  }
  .mr-20 {
    margin-right: 20px;
  }
  .el-collapse-item__header {
    font-size: 16px !important;
    background: rgba(223, 223, 223, 1);
    padding-left: 20px;
    // line-height: 40px;
    // height: 40px;
  }
  .packing-require .el-form-item {
    margin: 10px;
    margin-top: 15px;
    div {
      vertical-align: middle;
    }
    label {
      // margin-left: 60px;
    }
    .other-input {
      display: inline-block;
      width: 120px;
      margin-left: 20px;
      vertical-align: middle;
    }
  }
  .card-container {
    position: relative;
  }
  .check-right {
    position: absolute;
    right: 20px;
    top: -20px;
  }
  .label-left {
    font-size: 14px;
  }
  .col-33 {
    width: 33%;
    display: inline-block;
    vertical-align: top;
  }
  .upload-item-list {
    .el-col {
      height: 45px;
    }
  }
  .label-33 {
    width: 33%;
    display: inline-block;
    margin: 0 !important;
    .el-input-group {
      width: calc(100% - 50px);
    }
  }
  .boxCategories-lbl{
    font-size: 14px;
    padding-top:6px;
    color: #409EFF;
    font-weight: bold;
  }
}
</style>
<template>
  <div class="app-container calendar-list-container pack-con">
    <custom-card title="基本信息" v-if="page=='apply'">
      <basic-form :basicInfo="basicInfo" :ruleForm="pk.base" ref="basicForm"></basic-form>
    </custom-card>
    <div v-if="page!='apply'">
      <custom-card title="结构信息">
        <el-form>
          <el-form-item :label="item.label+'：'" v-for="(item,index) in basicInfo" :key="index" class="col-33" :style="{width:item.col+'%'}">
            <span v-if="index!=5&&index!=4&&index!=9">{{pk.base[item.name]}}</span>
            <span v-if="index==4">{{pk.base.customerName}}</span>
            <span v-if="index==5">{{pk.base.productCategoryName}}</span>
            <span v-if="index==9">{{pk.base.packagingStructureEngineerName}}</span>
          </el-form-item>
        </el-form>
      </custom-card>
      <custom-card title="附件" class="mt-30">
        <div>
          <el-row v-for="(item,index) in structureDocsOptions" :key="index" class="upload-item upload-item-list">
            <el-col :span="4">
              <span class="upload-name">{{language=='en'?item.labelEnUs:item.labelZhCh}}：</span>
            </el-col>
            <el-col :span="20">
              <a :href="baseUrl + '/' + item.file.fileUrl" class="upload-tip" target="_blank">{{item.file.fileName}}</a>
              <span v-if="!item.file.fileUrl" class="upload-tip">未上传</span>
            </el-col>
          </el-row>
        </div>
      </custom-card>
    </div>
    <el-form :model="pk.detail" :rules="pkDetailRules" ref="pkDetailForm">
      <custom-card title="包装要求" class="mt-30">
        <el-collapse v-model="activeName">
          <el-collapse-item title="纸箱" name="1">
            <custom-card title="种类选择(多选)" class="mt-30 packing-require" :class="{'empty-error':!pk.detail.boxFormingMethodFlag}">
              <div class="check-right">
                <el-checkbox label="由包装工程师选择" v-model="pk.detail.boxCategoriesFlag" @change="flagChange('boxCategoriesFlag')" :disabled="page!='apply'"></el-checkbox>
              </div>
              <el-form-item label="" prop="boxCategories">
                <el-checkbox-group v-model="pk.detail.boxCategories" :disabled="page=='apply'&&pk.detail.boxCategoriesFlag||page!='apply'&&!pk.detail.boxCategoriesFlag">
                  <el-checkbox v-for="option in options.boxCategoriesOptions" :key="option.id" :label="option.id">
                    {{language=='en'?option.labelZhCh:option.labelZhCh}}
                  </el-checkbox>
                  <el-input placeholder="请输入内容" v-model="pk.detail.boxCategoriesDesc" class="other-input" :disabled="page=='apply'&&pk.detail.boxCategoriesFlag||page!='apply'&&!pk.detail.boxCategoriesFlag"></el-input>
                </el-checkbox-group>
              </el-form-item>
              <el-row v-for="option in options.boxCategoriesOptions" :key="option.id" v-if="pk.detail.boxCategories.join().indexOf(option.id)>-1">
                <el-col :span="2" class="boxCategories-lbl">
                  {{language=='en'?option.labelZhCh:option.labelZhCh}}
                </el-col>
                <el-col :span="22">
                  <el-form-item label="长：" :prop="option.name+'Length'" class="label-33">
                    <el-input placeholder="请输入内容" v-model="pk.detail[option.name+'Length']" type="number" :disabled="page=='apply'&&pk.detail.boxCategoriesFlag||page!='apply'&&!pk.detail.boxCategoriesFlag">
                      <template slot="append">cm</template>
                    </el-input>
                  </el-form-item>
                  <el-form-item label="宽：" :prop="option.name+'Width'" class="label-33">
                    <el-input placeholder="请输入内容" v-model="pk.detail[option.name+'Width']" type="number" :disabled="page=='apply'&&pk.detail.boxCategoriesFlag||page!='apply'&&!pk.detail.boxCategoriesFlag">
                      <template slot="append">cm</template>
                    </el-input>
                  </el-form-item>
                  <el-form-item label="高：" :prop="option.name+'Height'" class="label-33">
                    <el-input placeholder="请输入内容" v-model="pk.detail[option.name+'Height']" type="number" :disabled="page=='apply'&&pk.detail.boxCategoriesFlag||page!='apply'&&!pk.detail.boxCategoriesFlag">
                      <template slot="append">cm</template>
                    </el-input>
                  </el-form-item>
                </el-col>
              </el-row>
            </custom-card>
            <custom-card title="形成方式" class="mt-30 packing-require">
              <div class="check-right">
                <el-checkbox label="由包装工程师选择" v-model="pk.detail.boxFormingMethodFlag" @change="flagChange('boxFormingMethodFlag')" :disabled="page!='apply'"></el-checkbox>
              </div>
              <el-form-item prop="boxFormingMethod">
                <el-radio-group v-model="pk.detail.boxFormingMethod" :disabled="page=='apply'&&pk.detail.boxFormingMethodFlag||page!='apply'&&!pk.detail.boxFormingMethodFlag">
                  <el-radio v-for="option in options.boxFormingMethodOptions" :key="option.id" :label="option.id">
                    {{language=='en'?option.labelZhCh:option.labelZhCh}}
                  </el-radio>
                  <el-input placeholder="请输入内容" v-model="pk.detail.boxFormingMethodDesc" class="other-input" :disabled="page=='apply'&&pk.detail.boxFormingMethodFlag||page!='apply'&&!pk.detail.boxFormingMethodFlag"></el-input>
                </el-radio-group>
              </el-form-item>
            </custom-card>
            <custom-card title="材质" class="mt-30 packing-require">
              <el-form-item prop="boxMaterial">
                <el-radio-group v-model="pk.detail.boxMaterial" :disabled="page!='apply'">
                  <el-radio v-for="option in options.boxMaterialOptions" :key="option.id" :label="option.id">
                    {{language=='en'?option.labelZhCh:option.labelZhCh}}
                  </el-radio>
                </el-radio-group>
              </el-form-item>
            </custom-card>
            <custom-card title="封口方式" class="mt-30 packing-require">
              <el-form-item prop="boxSealingMethod">
                <el-radio-group v-model="pk.detail.boxSealingMethod" :disabled="page!='apply'">
                  <el-radio v-for="option in options.boxSealingMethodOptions" :key="option.id" :label="option.id">
                    {{language=='en'?option.labelZhCh:option.labelZhCh}}
                  </el-radio>
                </el-radio-group>
              </el-form-item>
            </custom-card>
          </el-collapse-item>
          <el-collapse-item title="内衬" name="2">
            <custom-card title="种类选择" class="mt-30 packing-require">
              <div class="check-right">
                <el-checkbox label="由包装工程师选择" v-model="pk.detail.liningCategoriesFlag" @change="flagChange('liningCategoriesFlag')" :disabled="page!='apply'"></el-checkbox>
              </div>
              <el-form-item prop="liningCategories">
                <el-radio-group v-model="pk.detail.liningCategories" :disabled="page=='apply'&&pk.detail.liningCategoriesFlag||page!='apply'&&!pk.detail.liningCategoriesFlag">
                  <el-radio v-for="option in options.liningCategoriesOptions" :key="option.id" :label="option.id">
                    {{language=='en'?option.labelZhCh:option.labelZhCh}}
                  </el-radio>
                  <!-- <el-input placeholder="请输入内容" v-model="pk.detail.liningCategoriesDesc" class="other-input" :disabled="page=='apply'&&pk.detail.liningCategoriesFlag||page!='apply'&&!pk.detail.liningCategoriesFlag"></el-input> -->
                </el-radio-group>
              </el-form-item>
              <el-form-item label="长：" prop="liningLength" class="label-33">
                <el-input placeholder="请输入内容" v-model="pk.detail.liningLength" type="number" :disabled="page=='apply'&&pk.detail.liningCategoriesFlag||page!='apply'&&!pk.detail.liningCategoriesFlag">
                  <template slot="append">cm</template>
                </el-input>
              </el-form-item>
              <el-form-item label="宽：" prop="liningWidth" class="label-33">
                <el-input placeholder="请输入内容" v-model="pk.detail.liningWidth" type="number" :disabled="page=='apply'&&pk.detail.liningCategoriesFlag||page!='apply'&&!pk.detail.liningCategoriesFlag">
                  <template slot="append">cm</template>
                </el-input>
              </el-form-item>
              <el-form-item label="高：" prop="liningHeight" class="label-33">
                <el-input placeholder="请输入内容" v-model="pk.detail.liningHeight" type="number" :disabled="page=='apply'&&pk.detail.liningCategoriesFlag||page!='apply'&&!pk.detail.liningCategoriesFlag">
                  <template slot="append">cm</template>
                </el-input>
              </el-form-item>
            </custom-card>
          </el-collapse-item>
          <el-collapse-item title="销售包装" name="3">
            <custom-card title="泡壳" class="mt-30 packing-require">
              <div class="check-right">
                <el-checkbox label="由包装工程师选择" v-model="pk.detail.bubbleCategoriesFlag" @change="flagChange('bubbleCategoriesFlag')" :disabled="page!='apply'"></el-checkbox>
              </div>
              <el-form-item label="种类选择：" prop="bubbleCategories">
                <el-radio-group v-model="pk.detail.bubbleCategories" :disabled="page=='apply'&&pk.detail.bubbleCategoriesFlag||page!='apply'&&!pk.detail.bubbleCategoriesFlag">
                  <el-radio v-for="option in options.bubbleCategoriesOptions" :key="option.id" :label="option.id">
                    {{language=='en'?option.labelZhCh:option.labelZhCh}}
                  </el-radio>
                </el-radio-group>
              </el-form-item>
              <el-form-item label="打孔：" prop="bubblePunch">
                <el-radio-group v-model="pk.detail.bubblePunch" :disabled="page=='apply'&&pk.detail.bubbleCategoriesFlag||page!='apply'&&!pk.detail.bubbleCategoriesFlag">
                  <el-radio v-for="option in options.bubblePunchOptions" :key="option.id" :label="option.id">
                    {{language=='en'?option.labelZhCh:option.labelZhCh}}
                  </el-radio>
                </el-radio-group>
                <el-input placeholder="请输入内容" v-model="pk.detail.bubblePunchDesc" class="other-input" :disabled="page=='apply'&&pk.detail.bubbleCategoriesFlag||page!='apply'&&!pk.detail.bubbleCategoriesFlag"></el-input>
              </el-form-item>
              <el-form-item label="封口方式：" prop="bubbleSealingMethod">
                <el-radio-group v-model="pk.detail.bubbleSealingMethod" :disabled="page=='apply'&&pk.detail.bubbleCategoriesFlag||page!='apply'&&!pk.detail.bubbleCategoriesFlag">
                  <el-radio v-for="option in options.bubbleSealingMethodOptions" :key="option.id" :label="option.id">
                    {{language=='en'?option.labelZhCh:option.labelZhCh}}
                  </el-radio>
                </el-radio-group>
                <el-input placeholder="请输入内容" v-model="pk.detail.bubbleSealingMethodDesc" class="other-input" :disabled="page=='apply'&&pk.detail.bubbleCategoriesFlag||page!='apply'&&!pk.detail.bubbleCategoriesFlag"></el-input>
              </el-form-item>
            </custom-card>
            <custom-card title="PE袋" class="mt-30 packing-require">
              <div class="check-right">
                <el-checkbox label="由包装工程师选择" v-model="pk.detail.peCategoriesFlag" @change="flagChange('peCategoriesFlag')" :disabled="page!='apply'"></el-checkbox>
              </div>
              <el-form-item label="种类选择：" prop="peCategories">
                <el-radio-group v-model="pk.detail.peCategories" :disabled="page=='apply'&&pk.detail.peCategoriesFlag||page!='apply'&&!pk.detail.peCategoriesFlag">
                  <el-radio v-for="option in options.peCategoriesOptions" :key="option.id" :label="option.id">
                    {{language=='en'?option.labelZhCh:option.labelZhCh}}
                  </el-radio>
                </el-radio-group>
              </el-form-item>
              <el-form-item label="打孔：" prop="pePunch">
                <el-radio-group v-model="pk.detail.pePunch" :disabled="page=='apply'&&pk.detail.peCategoriesFlag||page!='apply'&&!pk.detail.peCategoriesFlag">
                  <el-radio v-for="option in options.bubblePunchOptions" :key="option.id" :label="option.id">
                    {{language=='en'?option.labelZhCh:option.labelZhCh}}
                  </el-radio>
                </el-radio-group>
                <el-input placeholder="请输入内容" v-model="pk.detail.pePunchDesc" class="other-input" :disabled="page=='apply'&&pk.detail.peCategoriesFlag||page!='apply'&&!pk.detail.peCategoriesFlag"></el-input>
              </el-form-item>
              <el-form-item label="封口方式：" prop="peSealingMethod">
                <el-radio-group v-model="pk.detail.peSealingMethod" :disabled="page=='apply'&&pk.detail.peCategoriesFlag||page!='apply'&&!pk.detail.peCategoriesFlag">
                  <el-radio v-for="option in options.bubbleSealingMethodOptions" :key="option.id" :label="option.id">
                    {{language=='en'?option.labelZhCh:option.labelZhCh}}
                  </el-radio>
                </el-radio-group>
                <el-input placeholder="请输入内容" v-model="pk.detail.peSealingMethodDesc" class="other-input" :disabled="page=='apply'&&pk.detail.peCategoriesFlag||page!='apply'&&!pk.detail.peCategoriesFlag"></el-input>
              </el-form-item>
              <el-form-item label="厚度：" prop="peThickness">
                <el-radio-group v-model="pk.detail.peThickness" :disabled="page=='apply'&&pk.detail.peCategoriesFlag||page!='apply'&&!pk.detail.peCategoriesFlag">
                  <el-radio v-for="option in options.peThicknessOptions" :key="option.id" :label="option.id">
                    {{language=='en'?option.labelZhCh:option.labelZhCh}}
                  </el-radio>
                </el-radio-group>
              </el-form-item>
            </custom-card>
          </el-collapse-item>
        </el-collapse>
      </custom-card>
      <custom-card title="物流要求" class="mt-30">
        <el-collapse v-model="activeNameLog">
          <el-collapse-item title="装柜" name="1">
            <custom-card title="种类选择" class="mt-30 packing-require">
              <el-form-item prop="loadingCategories">
                <el-radio-group v-model="pk.detail.loadingCategories" :disabled="page!='apply'">
                  <el-radio v-for="option in options.loadingCategoriesOptions" :key="option.id" :label="option.id">
                    {{language=='en'?option.labelZhCh:option.labelZhCh}}
                  </el-radio>
                  <el-input placeholder="请输入内容" v-model="pk.detail.loadingCategoriesDesc" class="other-input" :disabled="page!='apply'"></el-input>
                </el-radio-group>
              </el-form-item>
            </custom-card>
            <custom-card title="托盘种类" class="mt-30 packing-require">
              <el-form-item prop="trayCategories" label="种类选择：">
                <el-radio-group v-model="pk.detail.trayCategories" :disabled="page!='apply'">
                  <el-radio v-for="option in options.trayCategoriesOptions" :key="option.id" :label="option.id">
                    {{language=='en'?option.labelZhCh:option.labelZhCh}}
                  </el-radio>
                  <el-input placeholder="请输入内容" v-model="pk.detail.trayCategoriesDesc" class="other-input" :disabled="page!='apply'"></el-input>
                </el-radio-group>
              </el-form-item>
              <el-form-item prop="trayPackingMethod" label="打包方式：">
                <el-radio-group v-model="pk.detail.trayPackingMethod" :disabled="page!='apply'">
                  <el-radio v-for="option in options.trayPackingMethodOptions" :key="option.id" :label="option.id">
                    {{language=='en'?option.labelZhCh:option.labelZhCh}}
                  </el-radio>
                  <el-input placeholder="请输入内容" v-model="pk.detail.trayPackingMethodDesc" class="other-input" :disabled="page!='apply'"></el-input>
                </el-radio-group>
              </el-form-item>
              <el-form-item prop="traySize" label="尺寸：">
                <el-radio-group v-model="pk.detail.traySize">
                  <el-radio v-for="option in options.traySizeOptions" :key="option.id" :label="option.id" v-if="option.id==1||option.id==2" :disabled="page!='apply'">
                    {{language=='en'?option.labelZhCh:option.labelZhCh}}
                  </el-radio>
                  <el-input placeholder="请输入内容" v-model="pk.detail.traySizeSpecified" class="other-input mr-20" :disabled="page!='apply'"></el-input>
                  <el-radio v-for="option in options.traySizeOptions" :key="option.id" :label="option.id" v-if="option.id==0" :disabled="page!='apply'">
                    {{language=='en'?option.labelZhCh:option.labelZhCh}}
                  </el-radio>
                  <el-input placeholder="请输入内容" v-model="pk.detail.traySizeDesc" class="other-input" :disabled="page!='apply'"></el-input>
                </el-radio-group>
              </el-form-item>
              <el-form-item prop="containerSize" label="柜子大小：">
                <el-radio-group v-model="pk.detail.containerSize" :disabled="page!='apply'">
                  <el-radio v-for="option in options.containerSizeOptions" :key="option.id" :label="option.id">
                    {{language=='en'?option.labelZhCh:option.labelZhCh}}
                  </el-radio>
                  <el-input placeholder="请输入内容" v-model="pk.detail.containerSizeDesc" class="other-input" :disabled="page!='apply'"></el-input>
                </el-radio-group>
              </el-form-item>
              <el-form-item :prop="item.name" :label="language=='en'?item.labelZhCh:item.labelZhCh+'装箱量：'" v-for="item in options.containerSizeOptions" :key="item.id">
                <el-input placeholder="请输入内容" v-model="pk.detail[item.name]" class="other-input"></el-input>
              </el-form-item>
            </custom-card>
          </el-collapse-item>
          <el-collapse-item title="物流" name="2">
            <custom-card title="种类选择" class="mt-30 packing-require">
              <el-form-item prop="logisticsCategories">
                <el-radio-group v-model="pk.detail.logisticsCategories" :disabled="page!='apply'">
                  <el-radio v-for="option in options.logisticsCategoriesOptions" :key="option.id" :label="option.id">
                    {{language=='en'?option.labelZhCh:option.labelZhCh}}
                  </el-radio>
                </el-radio-group>
              </el-form-item>
            </custom-card>
          </el-collapse-item>
          <el-collapse-item title="跌落测试标准" name="3">
            <custom-card title="种类选择" class="mt-30 packing-require">
              <el-form-item prop="dropTestStandard">
                <el-radio-group v-model="pk.detail.dropTestStandard" :disabled="page!='apply'">
                  <el-radio v-for="option in options.dropTestStandardOptions" :key="option.id" :label="option.id">
                    {{language=='en'?option.labelZhCh:option.labelZhCh}}
                  </el-radio>
                </el-radio-group>
              </el-form-item>
            </custom-card>
          </el-collapse-item>
        </el-collapse>
      </custom-card>
    </el-form>
    <custom-card title="附件" class="mt-30" v-if="page=='apply'">
      <div>
        <el-row v-for="(item,index) in structureDocsOptions" :key="index" class="upload-item">
          <el-col :span="4">
            <span class="upload-name">{{language=='en'?item.labelZhCh:item.labelZhCh}}：</span>
          </el-col>
          <el-col :span="20">
            <upload-file @getFiles="getFiles" v-if="!item.file.fileName" :multiple="uploadIsMultiple" :uploadId="index.toString()">
            </upload-file>
            <!-- <span class="upload-tip" v-if="!item.file.fileName">支持扩展名：.rar .zip .jpg png ...</span> -->
            <a :href="baseUrl + '/' + item.file.fileUrl" class="upload-tip" target="_blank">{{item.file.fileName}}</a>
            <el-button size="small" type="danger" @click="delFile(index)" v-if="item.file.fileName">删除</el-button>
          </el-col>
        </el-row>
      </div>
    </custom-card>
     <custom-card title="设计文稿" class="mt-30" v-if="page!='apply'">
       <upload-list v-model="pk.designFileList"></upload-list>
    </custom-card>
    <div class="pds-btm mt-30">
      <div v-if="applyId && (!pk.base.applyStatus||!pk.base.applyStatus)">
        已保存草稿
        <span class="tip">{{pk.base.updateTime | formatTime}}</span>
      </div>
      <div class="right">
        <el-button class="filter-item" type="warning" @click="submitForm('draft')" :loading="loading" v-if="!pk.base.applyStatus">保存草稿</el-button>
        <el-button class="filter-item" type="primary" @click="submitForm('save')" :loading="loading">提交</el-button>
      </div>
    </div>
  </div>
</template>
<script>
import { mapGetters } from 'vuex';
import BasicForm from '@/components/BasicForm/index';
import * as api from '@/api/packing/index';
import structureMixins from '../mixins/structure';
import UploadList from '@/components/UploadList/index';

export default {
  name: 'user',
  components: {
    BasicForm,
    UploadList
  },
  mixins: [structureMixins],
  data() {
    return {
      uploadIsMultiple: false
    };
  },
  created() {
    this.getPdsConfCategoryTree();
    const setOptionIdToString = () => {
      for (const i in this.options) {
        this.options[i].forEach((value, key) => {
          value.id = value.id.toString();
          if (value.value > -1) {
            value.value = value.value.toString();
          }
        });
      }
    };
    setOptionIdToString();
  },
  activated() {
    this.page = this.$route.path.indexOf('require') > -1 ? 'apply' : 'design';
  },
  computed: {
    ...mapGetters(['elements', 'language'])
  },
  methods: {
    refresh() {
      if (
        this.$route.query.applyId
      ) {
        this.applyId = this.$route.query.applyId;
        this.getApplyStructureDetai();
        this.clearValidate()
      } else {
        this.pk = this.dataInit()
        this.clearValidate()
      }
    },
    getFiles(value, uploadId) {
      const newFile = Object.assign({}, value[value.length - 1]);
      newFile.fileId = newFile.id;
      this.structureDocsOptions[uploadId].file = newFile;
    },
    delFile(index) {
      this.$confirm('是否确认删除该文件？', '提示', {
        type: 'warning'
      })
        .then(() => {
          this.structureDocsOptions[index].file = {};
          this.$message({
            type: 'success',
            message: '删除成功!'
          });
        })
        .catch(() => {
          this.$message({
            type: 'info',
            message: '已取消删除'
          });
        });
    },
    async submitForm(type) {
      // 验证成功提交接口前数据整理
      const updateParams = JSON.parse(JSON.stringify(this.pk));

      const basicFormCheck = this.$refs.basicForm
        ? await this.$refs.basicForm.submitForm()
        : null;
      // if (!basicFormCheck) {
      //   this.$message.error('请填写完整基本信息');
      //   return;
      // }
      let pkDetailFormCheck = false;
      if (type !== 'draft') {
        this.$refs.pkDetailForm.validate(valid => {
          if (!valid) {
            this.$message.error('请填写完包装要求和物流要求！');
            return;
          } else {
            pkDetailFormCheck = true;
          }
        });
      }
      // if (!pkDetailFormCheck) {
      //   return
      // }
      const setUpdateParams = () => {
        if (updateParams.base.pdsConfCategoryArray.length !== 3) {
          this.$message.error('请选择产品小类');
        }
        for (const i in updateParams.detail) {
          if (i.indexOf('Flag') > -1) {
            updateParams.detail[i] = updateParams.detail[i] ? 1 : 0;
          }
        }
        updateParams.base.productCategoryId =
          updateParams.base.pdsConfCategoryArray[2];
        updateParams.detail.boxCategories = updateParams.detail.boxCategories.join();
        updateParams.pdsPackingDesignStructureDetail = updateParams.detail;

        updateParams.pdsPackingApplyStructure = updateParams.base;
        const setPdsPackingApplyStructureDocs = () => {
          updateParams.pdsPackingApplyStructureDocs = updateParams.pdsPackingApplyStructureDocs || [
            { fileType: 1 },
            { fileType: 2 },
            { fileType: 3 }
          ];
          this.structureDocsOptions.map((item, index) => {
            const fileItem =
              updateParams.pdsPackingApplyStructureDocs[index] || {};
            fileItem.fileName = item.file.fileName;
            fileItem.fileUrl = item.file.fileUrl;
            fileItem.fileId = item.file.fileId;
          });
        };
        setPdsPackingApplyStructureDocs();
      };
      setUpdateParams();
      const updateToServer = () => {
        if (this.loading) return;
        this.loading = true;
        // 成功提交数据后的处理
        const submitCallback = res => {
          this.loading = false;
          if (res.code === 200) {
            this.$message.success((type === 'save' ? '提交' : '保存草稿') + '成功')
            if (type === 'save') {
              this.$store.dispatch('delActiveViews');
            } else {
              this.refreshCb(res);
            }
          } else {
            this.$message.error(res.message);
          }
        };
        if (type === 'draft' && this.page === 'apply') {
          api
            .saveApplyStructureToDraft(updateParams)
            .then(res => {
              submitCallback(res);
            })
            .catch(err => {
              console.log(err);
              this.loading = false;
            });
        }
        if (type !== 'draft' && this.page === 'apply') {
          api
            .submitApplyStructure(updateParams)
            .then(res => {
              submitCallback(res);
            })
            .catch(err => {
              console.log(err);
              this.loading = false;
            });
        }
        if (type === 'draft' && this.page === 'design') {
          api
            .saveDesignStructureToDraft(updateParams)
            .then(res => {
              submitCallback(res);
            })
            .catch(err => {
              console.log(err);
              this.loading = false;
            });
        }
        if (type !== 'draft' && this.page === 'design') {
          api
            .submitDesignStructure(updateParams)
            .then(res => {
              submitCallback(res);
            })
            .catch(err => {
              console.log(err);
              this.loading = false;
            });
        }
      };
      updateToServer();
    }
  }
};
</script>
